<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- Favicon icon -->
    <!-- <link rel="icon" type="image/png" sizes="16x16" href="/favicon.png"> -->
    <title><%- docs.config.name %> - <%- docs.authName %>注册</title>
    <!-- Bootstrap Core CSS -->
    <link href="/assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom CSS -->
    <link href="/css/style.css" rel="stylesheet">
    <!-- You can change the theme colors from here -->
    <link href="/css/colors/blue.css" id="theme" rel="stylesheet">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="/https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="/https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
    <style media="screen">
        .form-group.validate input, .form-group.validate select, .form-group.validate textarea{
            border: none;
        }
        .form-group.error input{
            border: none;
        }
        .help-block{
            position: absolute;
        }
    </style>
</head>

<body>
    <!-- ============================================================== -->
    <!-- Preloader - style you can find in spinners.css -->
    <!-- ============================================================== -->
    <div class="preloader">
        <svg class="circular" viewBox="25 25 50 50">
            <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" /> </svg>
    </div>
    <!-- ============================================================== -->
    <!-- Main wrapper - style you can find in pages.scss -->
    <!-- ============================================================== -->
    <!-- <form class="m-t-40" novalidate>
        <div class="form-group">
            <h5>Basic Text Input <span class="text-danger">*</span></h5>
            <div class="controls">
                <input type="text" name="text" class="form-control" required data-validation-required-message="This field is required"> </div>
        </div>

        <div class="text-xs-right">
            <button type="submit" class="btn btn-info">Submit</button>
            <button type="reset" class="btn btn-inverse">Cancel</button>
        </div>
    </form> -->
    <section id="wrapper">
        <div class="login-register" style="background-image:url(../assets/images/background/login-register.jpg);">
            <div class="login-box card">
                <div class="card-body">
                    <form class="form-horizontal form-material" method="post" novalidate>
                        <h3 class="box-title m-b-20"><%- docs.authName %>注册</h3>
                        <div class="form-group">
                            <div class="col-xs-12 controls">
                                <input class="form-control" type="text" name="name" placeholder="用户名" required data-validation-callback-callback="isName" data-validation-required-message="用户名不准为空" />
                            </div>
                        </div>
                        <div class="form-group ">
                            <div class="col-xs-12 controls">
                                <input class="form-control" id="password" name="pwd" type="password" placeholder="登录密码" required data-validation-callback-callback="password"  data-validation-required-message="登录密码不准为空" />
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-xs-12 controls">
                                <input class="form-control" id="newPassword" type="password" placeholder="重复密码" required data-validation-callback-callback="newPassword" data-validation-required-message="重复密码不准为空" />
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-md-12">
                                <div class="checkbox checkbox-success">
                                    <input id="checkbox-signup" name="islogin" type="checkbox" checked="checked">
                                    <label for="checkbox-signup">注册完成后立即登录</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group text-center m-t-20">
                            <div class="col-xs-12">
                                <button class="btn btn-info btn-lg btn-block text-uppercase waves-effect waves-light" type="submit">注&nbsp;&nbsp;册</button>
                            </div>
                        </div>

                    </form>
                </div>
            </div>
        </div>
    </section>
    <!-- ============================================================== -->
    <!-- End Wrapper -->
    <!-- ============================================================== -->
    <!-- ============================================================== -->
    <!-- All Jquery -->
    <!-- ============================================================== -->
    <script src="/assets/plugins/jquery/jquery.min.js"></script>
    <!-- Bootstrap tether Core JavaScript -->
    <script src="/assets/plugins/bootstrap/js/popper.min.js"></script>
    <script src="/assets/plugins/bootstrap/js/bootstrap.min.js"></script>
    <!-- slimscrollbar scrollbar JavaScript -->
    <script src="/js/jquery.slimscroll.js"></script>
    <!--Wave Effects -->
    <script src="/js/waves.js"></script>
    <!--Menu sidebar -->
    <script src="/js/sidebarmenu.js"></script>
    <!--stickey kit -->
    <script src="/assets/plugins/sticky-kit-master/dist/sticky-kit.min.js"></script>
    <script src="/assets/plugins/sparkline/jquery.sparkline.min.js"></script>
    <!--Custom JavaScript -->
    <script src="/js/custom.min.js"></script>
    <script src="/js/validation.js"></script>
    <script>
    ! function(window, document, $) {
        "use strict";
        $("input,select,textarea").not("[type=submit]").jqBootstrapValidation(),
        $(".skin-square input").iCheck({
            checkboxClass: "icheckbox_square-green",
            radioClass: "iradio_square-green"
        }),
        $(".touchspin").TouchSpin(), $(".switchBootstrap").bootstrapSwitch();
    }(window, document, jQuery);
    </script>
    <!-- ============================================================== -->
    <!-- Style switcher -->
    <!-- ============================================================== -->
    <script src="/assets/plugins/styleswitcher/jQuery.style.switcher.js"></script>
    <script type="text/javascript">
        var isName = function($el,value,callback){
            callback({
              value: value,
              valid: value.length >= 3 && value.length <= 20,
              message: "用户名长度限制在3至20位。"
            });
        };
        var password = function($el,value,callback){
            callback({
              value: value,
              valid: value.length >= 9 && value.length <= 20,
              message: "密码长度限制在9至20位。"
            });
        };
        var newPassword = function($el,value,callback){
            var pwd = $("#password").val()
            callback({
              value: value,
              valid: value === pwd,
              message: "登录密码与重复密码不一样"
            });
        };
    </script>
</body>

</html>
